<%@page import="java.util.HashMap"%>
<%@ page language="java" contentType="text/html;" pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Search for Patients</title>

<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>

<!-- form validation provided by http://www.position-absolute.com/articles/jquery-form-validator-because-form-validation-is-a-mess/ -->
<script src="js/jquery.validationEngine-en.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jquery.validationEngine.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" href="css/validationEngine.jquery.css" type="text/css"/>

<link rel="icon" type="image/png" href="images/logo-favicon.png" />
<link rel="stylesheet" type="text/css" href="css/standard.css" />
<link rel="stylesheet" type="text/css" href="css/banner.css" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<script src="js/input.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<%@ include file="banner.jsp" %>
<div id="content">
<form id="criteria" method="post" action="search.do">
	<table>
		<tr>
			<td>First Name:</td>
			<td><input id="firstName" name="firstName" type="text" /></td>
		</tr>
		<tr>
			<td>Last Name:</td>
			<td><input id="lastName" name="lastName" type="text" /></td>
		</tr>
		<tr>
			<td>Age Range:</td>
			<td>
				<div id="divDoBRange">
					<input class="validate[condRequired[maxAge]],custom[integer],min[0]]" id="minAge" name="minAge" type="number" step="1" min="0" /> to 
					<input class="validate[condRequired[minAge]],custom[integer],min[0]]" id="maxAge" name="maxAge" type="number" step="1" min="0" /> <input id="btnShowDoB" class="button" type="button" value="DoB" />
				</div>
				<div id="divDoB">
					<input id="DoB" name="DoB" type="text" /> <input id="btnShowDoBRange" class="button" type="button" value="DoB Range" />
				</div>
			</td>
		</tr>
		<tr>
			<td>Race:</td>
			<td>
				<select id="race" name="race">
					<option>--</option>
					<option value="White">White</option>
					<option value="Hispanic">Hispanic or Latino</option>
					<option value="Black">Black or African American</option>
					<option value="Native American/Inuit">American Indian/Alaska Native</option>
					<option value="Oriental">Oriental</option>
					<option value="Hawaiian">Hawaiian Native/Pacific Islander</option>
					<option value="Other">Other</option>
				</select>
			</td>
		</tr>
		<tr>
			<td>Gender:</td>
			<td>
				<select id="gender" name="gender">
				  <option>--</option>
				  <option value="M">Male</option>
				  <option value="F">Female</option>
				</select>
			</td>
		</tr>
		<tr>
			<td>Insurance Provider:</td>
			<td>
				<input id="insurance" name="insurance" type="text" />
			</td>
		</tr>
		<tr id="trAllergies">
			<td>Allergies:</td>
			<td>
				<input class="allergies" name="allergies" type="text" />  
				<input type="button" id="btnAddAllergy" class="button" value="+" />
				Match all: <input type="radio" id="defaultAllergiesCombinationType" name="allergiesCombinationType" value="add" checked=checked />
				Match any: <input type="radio" name="allergiesCombinationType" value="or" />
			</td>
		</tr>
		<tr id="trMedications">
			<td>Medications:</td>
			<td>
				<input class="medications" name="medications" type="text" /> 
				<input type="button" id="btnAddMedication" class="button" value="+" />
				Match all: <input type="radio" id="defaultMedicationsCombinationType" name="medicationsCombinationType" value="add" checked=checked />
				Match any: <input type="radio" name="medicationsCombinationType" value="or" />
			</td>
		</tr>
		<tr>
			<td>City:</td>
			<td><input id="city" name="city" type="text" /></td>
		</tr>
		<tr>
			<td>State:</td>
			<td><input id="state" name="state" type="text" /></td>
		</tr>
		<tr>
			<td>Country:</td>
			<td><input id="country" name="country" type="text" /></td>
		</tr>
		<tr>
			<td>Postal Code:</td>
			<td><input id="postalCode" name="postalCode" type="text" /></td>
		</tr>
		<tr>
			<td>Blood Type:</td>
			<td>
				<select id="bloodType" name="bloodType">
					<option>--</option>
					<option value="A+">A+</option>
					<option value="A-">A-</option>
					<option value="B+">B+</option>
					<option value="B-">B-</option>
					<option value="AB+">AB+</option> 
					<option value="AB-">AB-</option> 
					<option value="O+">O+</option>
					<option value="O-">O-</option>    
				</select>
			</td>
		</tr>
		<tr>
			<td>Religious Preference:</td>
			<td><input id="religion" name="religion" type="text" /></td>
		</tr>
		<tr>
			<td>Doctor's Last Name:</td>
			<td><input id="drLastName" name="drLastName" type="text" /></td>
		</tr>
		<tr>
			<td>Date of Visit:</td>
			<td>
			<div id="divDateLastVisitRange">
				<input class="validate[condRequired[dateLastVisitMax]]" id="dateLastVisitMin" name="dateLastVisitMin" type="text" /> to
				<input class="validate[condRequired[dateLastVisitMin]]" id="dateLastVisitMax" name="dateLastVisitMax" type="text" />
				<input type="button" class="button" id="btnShowDateLastVisit" value="Date of Visit" />
			</div>
			<div id="divDateLastVisit">
				<input id="dateLastVisit" name="dateLastVisit" type="text" />
				<input type="button" class="button" id="btnShowDateLastVisitRange" value="Date of Visit Range" />
			</div>
			</td>
		</tr>
		<tr>
			<td>Reason for Visit:</td>
			<td><input id="reason" name="reason" type="text" /></td>
		</tr>
		<tr>
			<td><input id="submit" class="button" type="submit" value="Search" /></td>
		</tr>
	</table>	
</form>
</div>
</body>
</html>